.top-bar {
	z-index: 10;
	height: 88rpx;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding-top: var(--status-bar-height);
	background: $uni-bg-color;

	.top-bar-left {
		padding-left: 30rpx;
		width: 68rpx;
		height: 68rpx;

		image {
			width: 68rpx;
			height: 68rpx;
			border-radius: 16rpx;
		}
	}
	.top-bar-right {
		padding-right: 8rpx;
		display: flex;

		.search,
		.add {
			width: 70rpx;
			height: 70rpx;
			display: flex;
			align-items: center;
			justify-content: center;

			image {
				width: 52rpx;
				height: 52rpx;
			}
		}

		.text {
			font-size: $uni-font-size-lg;
			font-weight: 600;
			color: $uni-text-color;
			line-height: 88rpx;
		}
	}
}

.bottom-bar {
	position: fixed;
	bottom: 0;
	width: 100%;
	height: 104rpx;
	display: flex;
	justify-content: center;
	padding-bottom: env(safe-area-inset-bottom);
	align-items: center;

	.bottom-btn {
		width: 684rpx;
		height: 80rpx;
		line-height: 80rpx;
		background-color: #5b8bea;
		color: #FFFFFF;
		text-align: center;
		font-weight: 600;
		border-radius: $uni-border-radius-sm;
	}
}
